

function renderCategory() {
  $.ajax({
    url: '/my/category/list',
    success: function (res) {
      if (res.status === 0) {
        let tr = ''
        res.data.forEach(item => {
          tr += `
          <tr>
          <td>${item.name}</td>
          <td>${item.alias}</td>
          <td>
            <button data-id="${item.id}" data-name="${item.name}" data-alias="${item.alias}" type="button" class="layui-btn layui-btn-xs">编辑</button>
            <button data-id="${item.id}" type="button" class="layui-btn layui-btn-xs layui-btn-danger">删除</button>
          </td>
        </tr>
          `
        });
        $('tbody').html(tr)
      }
    }
  })
}
renderCategory()

// 删除分类
$('tbody').on('click', 'button:contains("删除")', function () {
  let id = $(this).data('id')
  layer.confirm('确认删除吗', function (index) {
    $.ajax({
      url: '/my/category/delete',
      data: { id: id },
      success: function (res) {
        if (res.status === 0) {
          layer.msg(res.message)
          renderCategory()
        }
      }
    })
    layer.close(index)
  })
})

// 点击添加分类
let addIndex
$('button:contains("添加类别")').on('click', function () {
   addIndex = layer.open({
    type : 1,
    title : '添加分类',
    area: ['500px', '250px'],
    content: $('#tpl-add').html()
  });
  //拿到的index是一个重要的凭据，它是诸如layer.close(index)等方法的必传参数。  
    
})

// 提交数据完成添加
$('body').on('submit', '#add-form', function (e) {
  e.preventDefault()
  let data = $(this).serialize()
  $.ajax({
    url: '/my/category/add',
    type: 'POST',
    data: data,
    success: function (res) {
      if (res.status === 0) {
        layer.msg(res.message)
        renderCategory()
        layer.close(addIndex) //关闭弹窗
      }
    }
  })
})
  
// 编辑类别
let editIndex
$('tbody').on('click', 'button:contains("编辑")', function () {
  let data = $(this).data()
  // console.log(data);
   editIndex = layer.open({
    type : 1,
    title : '编辑分类',
    area: ['500px', '250px'],
    content: $('#tpl-edit').html()
   })
  let form = layui.form
  form.val('asd',data)
})
  
// 编辑确认提交
$('body').on('submit', '#edit-form', function (e) {
  e.preventDefault()
  let data = $(this).serialize()
  $.ajax({
    type: 'POST',
    url: '/my/category/update',
    data: data,
    success: function (res) {
      if (res.status === 0) {
        layer.msg(res.message)
        renderCategory()
        layer.close(editIndex)
      }
    }
  })
})